<template>
  <el-dialog
    title="新增"
    :visible.sync="dialogVisible"
    width="80%"
  >
    <el-table
      :border="true"
      ref="multipleTable"
      :data="tableData"
      tooltip-effect="dark"
      style="width: 100%"
    
    >
      <el-table-column type="selection" width="66"   align="center">
      </el-table-column>
      <el-table-column prop="userId" label="用户ID" width="300" align="center">
      </el-table-column>
      <el-table-column prop="nickName" label="用户昵称" align="center"> </el-table-column>
      <el-table-column prop="status" label="状态" align="center">
        <template slot-scope="scope">
          <el-tag v-if="scope.row.status === 0" size="mini" type="danger"
            >禁用</el-tag
          >
          <el-tag v-else size="mini">正常</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="wxId" label="微信号" align="center"> </el-table-column>
    </el-table>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="page.currentPage"
      :page-sizes="[10, 20, 30, 40]"
      :page-size="page.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="page.total"
    >
    </el-pagination>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="close">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
export default {
  data() {
    return {
      dialogVisible: false,
      tableData: [],
      page: {
        page: 1,
        total: 0,
        pageSize: 10,
        currentPage:0
      },
    };
  },
  methods: {
    close() {
      this.$http({
        url:this.$http.adornUrl("/vip-package/editUser"),
        methos:"PUT",
      }).then(({data})=>{
console.log(data);
      })
       this.$message({
          message: '操作成功',
          type: 'success'
        });
      this.dialogVisible = false
    },
  getData(page, params) {
      this.$http({
        url: this.$http.adornUrl("/admin/user/page"),
        method: "get",
         params: this.$http.adornParams(
          Object.assign(
            {
              current: page == null ? this.page.currentPage : page.currentPage,
              size: page == null ? this.page.pageSize : page.pageSize
            },
            params
          )
        )
      }).then(({ data }) => {
        console.log(data);
        this.tableData = data.records;
        this.page.total = data.total;

        // //解决页数问题《
        this.page.currentPage = data.current;
      });

  },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.page.pageSize = val;
      this.getData();
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.page.currentPage = val;
      this.getData();
    },


},
  created() {
    this.getData();
  },
}
</script>

<style>
</style>